<!doctype html>
<html>

	<head>
		<meta charset="utf-8" />
		<meta content="yes" name="apple-mobile-web-app-capable">
		<meta content="black" name="apple-mobile-web-app-status-bar-style">
		<meta content="telephone=no" name="format-detection">
		<meta content="email=no" name="format-detection">
		<title>日期时间选择控件</title>
		<style type="text/css">
			* {
				margin: 0;
				padding: 0;
				-webkit-appearance: none;
				-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
				-webkit-touch-callout: none;
				box-sizing: border-box;
			}
			
			html,
			body {
				margin: 0 auto;
				width: 100%;
				min-height: 100%;
				overflow-x: hidden;
				-webkit-user-select: none;
			}
			
			body {
				font-family: Helvetica Neue, Helvetica, Arial, sans-serif;
				-webkit-text-size-adjust: 100%;
				-webkit-overflow-scrolling: touch;
				overflow-scrolling: touch;
			}
			
			input {
				width: 90%;
				height: 40px;
				font-size: 18px;
				border: 1px solid #19b5ee;
				border-radius: 5px;
				margin: 20px 5% 0 5%;
				padding: 5px;
			}
		</style>
		<link rel="stylesheet" href="lCalendar.css">
	</head>

	<body>
		<div>
			<input type="text" readonly="" name="input_date" placeholder="请输入时间" id="dateInput" value="2018-09-17"/>
		</div>
		<script src="flexible.js"></script>
		<script src="lCalendar.js"></script>
		<script>
			var calendar = new LCalendar();
			calendar.init({
				'trigger': '#dateInput', //标签id
				'type': 'date', //date 调出日期选择 datetime 调出日期时间选择 time 调出时间选择 ym 调出年月选择
				'minDate': '2000-1-1', //最小日期 注意：该值会覆盖标签内定义的日期范围
				'maxDate': '2022-12-12' //最大日期 注意：该值会覆盖标签内定义的日期范围
			});
		</script>
	</body>

</html>